﻿
@{
    ViewBag.Title = Resources.WebStringsWeb.WebTitle;
    Layout = "~/Views/Shared/_LayoutMobile.cshtml";
}

@section css {
    <link href="~/Assets/css/previewImage.css" rel="stylesheet" />
    <link href="~/Assets/css/mui.picker.min.css" rel="stylesheet" />
    <script src="~/Assets/js/mui.picker.js"></script>
    <script src="~/Assets/js/mui.picker.min.js"></script>
    <script src="~/Assets/js/mui.dtpicker.js"></script>
    <style>
        .mui-bar ~ .mui-content .mui-scroll-wrapper {
            top: 44px;
            height: auto;
        }

        .btn_addPic {
            display: block;
            position: relative;
            width: 53px;
            height: 53px;
            overflow: hidden;
            cursor: pointer;
            text-align: center;
        }

        .filePrew {
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            width: 53px;
            height: 53px;
            opacity: 0;
        }

        .location {
        }


        table.gridtable {
            width:95%;
            margin:0px auto;
            font-family: verdana,arial,sans-serif;
            font-size: 11px;
            color: #333333;
            border-width: 1px;
            border-color: lightgray;
            border-collapse: collapse;
        }

            table.gridtable th {
                border-width: 1px;
                padding: 8px;
                border-style: solid;
                border-color: lightgray;
                background-color: #dedede;
            }

            table.gridtable td {
                border-width: 1px;
                padding: 8px;
                border-style: solid;
                border-color: lightgray;
                background-color: #ffffff;
            }
    </style>
}
<div ng-controller="SafetyPlaceConfigController" ng-init="
     ParkId='@(Request.QueryString["ParkId"].IsEmpty() ? "0" : Request.QueryString["ParkId"])';
     ParkName='@(Request.QueryString["ParkName"].IsEmpty() ? "" : Request.QueryString["ParkName"])';
     MGetParkMap(ParkId);
       ">
    <header class="mui-bar mui-bar-nav">
        <button type="button" class="mui-left mui-action-back mui-btn mui-btn-link mui-btn-nav mui-pull-left" style="color:white;">
            <span class="mui-icon mui-icon-left-nav" style=""></span>
        </button>
        <h1 class="mui-title" style="color:white;">{{ParkName}}</h1>
    </header>

    <div class="mui-content">
        <div ng-cloak class="mui-content-padded" style="margin: 5px;">
            <div ng-show="MapList==null || MapList.length==0">
                <h5 style="width:100%;text-align:center;">暂未上传园区场景图</h5>
            </div>
            <div class="mui-card" ng-repeat="x in MapList">
                @*<div class="mui-card-header mui-card-media">
                    <div class="mui-media-body" style="margin-left:5px;">
                        {{x.Title}}
                        <p>{{x.Remark}}</p>
                    </div>
                </div>*@
                <div class="mui-card-content">
                    <div onclick="GoBuilding(9,'1号楼');" ng-if="ParkId==1" style="position: absolute; top:30%; left: 48%; width:9%; height: 26%; border:1px solid lightblue;"></div>
                    <div onclick="GoBuilding(14,'2号楼');" ng-if="ParkId==1" style="position: absolute; top: 47%; left: 58%; width: 10%; height: 9%; border: 1px solid lightblue; "></div>
                    <div onclick="GoBuilding(15,'3号楼');" ng-if="ParkId==1" style="position: absolute; top: 48%; left: 34%; width: 4%; height: 9%; border: 1px solid lightblue; "></div>
                    <div onclick="GoBuilding(13,'5号楼');" ng-if="ParkId==1" style="position: absolute; top: 51%; left: 20%; width: 4%; height: 9%; border: 1px solid lightblue;"></div>

                    <div onclick="GoBuilding(11,'2号楼');" ng-if="ParkId==2" style="position: absolute; top: 41%; left: 49%; width: 11%; height: 43%; border: 1px solid lightblue; "></div>
                    <div onclick="GoBuilding(12,'3号楼');" ng-if="ParkId==2" style="position: absolute; top: 26%; left: 69%; width: 13%; height: 30%; border: 1px solid lightblue; "></div>
                    <img src="{{x.FileInfo[0].FilePath}}" alt="" width="100%">
                </div>
            </div>
            <table ng-if="ParkId==1" class="gridtable">
                <thead>
                    <tr>
                        <th>楼栋</th>
                        <th>场所</th>
                        <th>类型</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td rowspan="6">
                            1号楼
                        </td>
                        <td>
                            龙华10kv变电站
                        </td>
                        <td>
                            危险点
                        </td>

                    </tr>
                    <tr>
                        <td>后勤保障涉密计算机房（329）</td>
                        <td>重要部位</td>
                    </tr>
                    <tr>
                        <td>调查部飞机故障件储存室（606）</td>
                        <td>重要部位</td>
                    </tr>
                    <tr>
                        <td>人力资源部档案室（801）</td>
                        <td>重要部位</td>
                    </tr>
                    <tr>
                        <td>财务部账册储存室（918）</td>
                        <td>重要部位</td>
                    </tr>
                    <tr>
                        <td>办公室机要室（920）</td>
                        <td>重要部位</td>
                    </tr>
                    <tr>
                        <td rowspan="2">
                            2号楼
                        </td>
                        <td>
                            消防水泵房
                        </td>
                        <td>
                            重要部位
                        </td>

                    </tr>
                    <tr>
                        <td>大飞机云锦托育园</td>
                        <td>重要部位</td>
                    </tr>
                    <tr>
                        <td>
                            3号楼
                        </td>
                        <td>
                            龙华园区油污井
                        </td>
                        <td>
                            重要部位
                        </td>

                    </tr>
                    <tr>
                        <td>
                            5号楼
                        </td>
                        <td>
                            龙华园区污水泵房
                        </td>
                        <td>
                            重要部位
                        </td>

                    </tr>
                </tbody>
            </table>
            <table ng-if="ParkId==2" class="gridtable">
                <thead>
                    <tr>
                        <th>楼栋</th>
                        <th>场所</th>
                        <th>类型</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td rowspan="2">
                            2号楼
                        </td>
                        <td>
                            信息化中心116机房
                        </td>
                        <td>
                            重要部位
                        </td>
                    </tr>
                    <tr>
                        <td>
                            信息化中心216机房
                        </td>
                        <td>
                            重要部位
                        </td>
                    </tr>
                    <tr>
                        <td rowspan="2">
                            3号楼
                        </td>
                        <td>
                            情报档案中心2楼库房
                        </td>
                        <td>
                            重要部位
                        </td>
                    </tr>
                    <tr>
                        <td>
                            情报档案中心3楼库房
                        </td>
                        <td>
                            重要部位
                        </td>
                    </tr>
                </tbody>
            </table>
            @*<div class="row image-list" style="margin-top:20px;margin-bottom:100px;" >
            <p style="width:100%; text-align:center;">{{x.Title}}</p>
            <img ng-repeat="y in x.FileInfo" class="image-item space" style="display:inline-block;width:100%;margin:10px auto;" ng-src="{{y.FilePath}}" data-preview-src="" data-preview-group="1" />
            <p style="width:100%;text-align:center;">{{x.Remark}}</p>
        </div>*@
        </div>
    </div>
</div>

<div style="height:80px;">

</div>

@section js{

    <script src="~/Assets/js/libs/upload.js"></script>
    <script src="~/Assets/js/mui.zoom.js"></script>
    <script src="~/Assets/js/mui.previewimage.js"></script>
    <script src="~/Assets/js/pg/SafetyPlaceConfig.js?v=@DateTime.Now.ToString("yyyyMMddHH")"></script>
    <script>

        mui.showLoading("正在加载..", "div");

        setTimeout(function () {
            mui.hideLoading();
            mui.previewImage();
        }, 1000);

        function GoBuilding(id, name) {
            window.location.href = '../Home/MBuildingMapView?BuildingId=' + id + "&BuildingName=" + name;
        }
    </script>
}
